﻿<CodeSnippetTabbed DocLink="https://docs.devexpress.com/Blazor/DevExpress.Blazor.DxPivotGrid-1#visualize-data">
    <CodeSnippetTabPage Text="Razor">@(@"<DxChart Data=""@(PivotGridDataProvider.ChartDataSource)""
         CssClass=""mw-1100"">
    <DxChartCommonSeries NameField=""@((IChartDataItem s) => s.SeriesName)""
                         ArgumentField=""@(s => s.Argument)""
                         ValueField=""@(s => s.Value)""
                         PaneField=""@(s => s.ValueFieldName)""
                         SeriesType=""ChartSeriesType.Bar"" />
</DxChart>
<DxPivotGrid Data=""@(PivotGridDataProvider.PivotGridDataSource)""
             CssClass=""mw-1100"">
    <DxPivotGridField Field=""@nameof(SaleInfo.Region)"" SortOrder=""PivotGridSortOrder.Ascending"" Area=""PivotGridFieldArea.Row"" />
    <DxPivotGridField Field=""@nameof(SaleInfo.Country)"" Area=""PivotGridFieldArea.Row"" />
    <DxPivotGridField Field=""@nameof(SaleInfo.City)"" Area=""PivotGridFieldArea.Row"" />
    <DxPivotGridField Field=""@nameof(SaleInfo.Date)"" GroupInterval=""PivotGridGroupInterval.Year"" Area=""PivotGridFieldArea.Column"" Caption=""Year"" />
    <DxPivotGridField Field=""@nameof(SaleInfo.Date)"" GroupInterval=""PivotGridGroupInterval.Quarter"" Area=""PivotGridFieldArea.Column"" Caption=""Quarter"">
        <HeaderTemplate>@string.Format(""Q{0}"", context)</HeaderTemplate>
    </DxPivotGridField>
    <DxPivotGridField Field=""@nameof(SaleInfo.Amount)"" Area=""PivotGridFieldArea.Data"" SummaryType=""PivotGridSummaryType.Sum"" />
    <DxPivotGridField Field=""@nameof(SaleInfo.OrderId)"" Caption=""Count"" Area=""PivotGridFieldArea.Data"" SummaryType=""PivotGridSummaryType.Count"" />
</DxPivotGrid>

@code {
    DxPivotGridDataProvider<SaleInfo> PivotGridDataProvider = DxPivotGridDataProvider<SaleInfo>.Create(Sales.Load());
}")</CodeSnippetTabPage>
</CodeSnippetTabbed>
